<template>
	<view>
		<view class="address_auto">
		<view class="list_box">
		  <view class="title">站点名</view>
		  <input class="text" placeholder="请填写站点名" v-model="name"></input>
		</view>
		<view class="list_box">
		  <view class="title">联系电话</view>
		  <input class="text" placeholder="请填写联系电话" v-model="phone"></input>
		</view>
		<view class="list_box">
		  <view class="title">获取位置:</view>
		  <input class="text" :disabled="true" :placeholder="location"></input>
			<view class="icon iconfont22" @tap="openMap">&#xe622;</view>
		</view>


		</view>
		
		<button class="confirm" @tap='go'>添加</button>
		

		
	</view>
</template>

<script>

	export default {
	data() {
		return {
			name:'',
			phone:'',
			lng:'',
			lat:'',
			location:'请点击获取位置',
		};
	},
onLoad(e){
			var that = this;
				that.Net._get('fwzdata',{},(res)=>{
					if(res.code ==1){
						if(res.data)
						{
							that.name=res.data.name
							that.phone=res.data.phone
							that.lng=res.data.lng
							that.lat=res.data.lat
								that.location=res.data.address
						}
					}
				});
		
		},
	methods: {
		go() {
			var that = this;	
			if(!that.name || !that.phone || !that.lat || !that.lng || !that.location)
			{
				that.Msg.Fail('请输入完整信息');
				return
			}
				that.Net._get('fwzin',{name:that.name,phone:that.phone,lat:that.lat,lng:that.lng,address:that.location},(res)=>{
					if(res.code ==1){
						that.Msg.Success(res.msg,(res)=>{
						uni.navigateBack()
						})
					}
				});
		},
		openMap() {
			var that = this;	
			uni.chooseLocation({
				success: function(res) {
					that.location = res.address;
					that.lat = res.latitude;
					that.lng = res.longitude;
					console.log('位置名称：' + res.name);
					console.log('详细地址：' + res.address);
					console.log('纬度：' + res.latitude);
					console.log('经度：' + res.longitude);
				}
			});
			// uni.getLocation({
			//     type: 'wgs84',
			// 	geocode:true,
			//     success: function (res) {				
			//         console.log('当前位置的经度：' + res.longitude);
			//         console.log('当前位置的纬度：' + res.latitude);
			// 		console.log('当前位置的城市：' + res.address.city);
			// 		console.log('当前位置的城市：' + res.address.district);
			// 		that.location = res.address.city + res.address.district;
			//     }
			// });
		},

		
	}
};
</script>

<style>
	page{
		background-color: #f8f8f8;
	}
	
	.address_auto{
		width: 90%;
		margin: 4% 5%;
		box-sizing: border-box;
		border-radius: 3vw;
		display: inline-block;
		box-shadow: 0 0 10rpx #bababa;
	}
	.list_box{
	  width: 100%;
	  height: 60px;
	  background-color: #fff;
	  position: relative;
	  margin-bottom: 1px;
		display: flex;
	}
	
	.list_box:nth-child(1){
	  border-radius: 3vw 3vw 0 0;
	}
	
	.list_box:last-child{
		border-radius: 0 0 3vw 3vw;
	}
	
	.list_box .title{
	  font-size: 14px;
	  color: #333;
	  line-height: 60px;
	  margin-left: 26px;
	}
	
	.list_box .icon{
		font-size: 7vw;
		color: #4d726f;
		line-height: 60px;
		margin-right: 3vw;
		
	}
		
	
	.list_box .text{
	  height: 60px;
	  line-height: 60px;
	  font-size: 14px;
	  color: #666;
	  text-align: right;
		flex: 1;
		margin-right: 3vw;
	  
	}
	
	
	
	textarea{
	  width: 100%;
	  height: 100px;
	  padding: 10px;
	  font-size: 12px;
	  color: #333;
	  background-color: #fff;
	  text-indent: 16px;
		border-radius: 0 0 3vw 3vw;
	}
	
	
	.confirm03{
		width: 92%;
		height: 12vw;
		border-radius: 12vw;
		line-height: 12vw;
		text-align: center;
		border: 1px solid #4d726f;
		color: #4d726f;
		font-size: 4vw;
		margin: 0 auto;
		margin-top: 15vw;
		box-sizing: border-box;
	}
</style>
